<template>
	<view class="content">
		<p class="tit">Sign In</p>
		<view class="userform">
			<input type="text" placeholder="输入账号" class="userinput" v-model="user.text" />
			<input type="password" placeholder="输入密码" class="userinput" v-model="user.password" />
			<button class="btn">登录</button>
			<label class="usercheck">
				<checkbox value="cb" class="checks" />登录代表您已同意平台<text class="userwarn">服务协议、隐私政策</text>
			</label>
		</view>
	</view>
</template>

<script setup>
	// 接口示例
	// import {getTitleApi} from '../../service/api.js'
	import {ref} from 'vue'
	const user = ref({
		text: '',
		password: ''
	})
</script>

<style lang="scss" scoped>
	.content {
		margin-top: 25px;
	}

	.tit {
		font-size: 30px;
		margin-left: 20px;
		color: #191851;
		font-weight: 700;
	}

	.userform {
		display: flex;
		flex-direction: column;
		align-items: center;
		font-size: 14px;
		margin-top: 15px;
	}

	.userinput {
		width: 90%;
		border-bottom: 1px solid #F7F7F7;
		margin-top: 15px;
		padding: 5px;
	}

	.btn {
		background-color: #FFDD00;
		border-radius: 10px;
		width: 90%;
		margin-top: 15px;
		font-size: 16px;
	}

	.usercheck {
		margin-top: 15px;
		font-size: 12px;
	}

	.checks {
		transform: scale(0.6)
	}

	.userwarn {
		color: red;
	}
</style>